<!--  -->
<template>
  <div>
    <el-dialog title="分配的物资" :visible.sync="openDialog" width="80%" @close="closeDialog">
      <p style="text-align:left;font-size:16px">物资：</p>
      <el-table :data="goods" style="width: 100%">
        <el-table-column prop="name" label="物资名称">
        </el-table-column>
        <el-table-column prop="spec" label="规格型号">
        </el-table-column>
        <el-table-column prop="dw" label="单位">
        </el-table-column>
        <el-table-column prop="materialType" label="类型">
        </el-table-column>
        <el-table-column prop="num" label="数量">
        </el-table-column>
      </el-table>
      <p style="font-size:16px">
        <span style="float:left;width:50%;text-align:left">根据工序分配物资：</span>
        <span @click="openGoods" style="float: right;color:#409eff;width:50%;text-align:right">分配物资</span>
      </p>
      <el-table :data="bindGoods" style="width: 100%">
        <el-table-column prop="gxname" label="工序">
        </el-table-column>
        <el-table-column prop="wzname" label="物资名称">
        </el-table-column>
        <el-table-column prop="spec" label="规格型号">
        </el-table-column>
        <el-table-column prop="wzunit" label="单位">
        </el-table-column>
        <el-table-column prop="materialType" label="类型">
        </el-table-column>
        <el-table-column prop="fillNum" label="数量">
        </el-table-column>
      </el-table>
      <div slot="footer" class="dialog-footer">
        <el-button @click="closeDialog">取 消</el-button>
        <el-button>确 定</el-button>
      </div>
    </el-dialog>
    <Goods :openGoodsDialog="openGoodsDialog" @closeGoodsDialog="closeGoodsDialog" :goods="goods" :templateUuid="templateUuid" @checkedProcessGoods="checkedProcessGoods" :bindGoods="bindGoods"></Goods>
  </div>
</template>

<script>
import Goods from './Goods';
export default {
  name: 'bindMaterial',
  components: {
    Goods
  },
  props: {
    openDialog: { type: Boolean },
    templateUuid: { type: String }
  },
  data () {
    return {
      goods: [],
      bindGoods: [],
      openGoodsDialog: false
    };
  },


  watch: {
    templateUuid (val) {
      if (val) {
        this.getSelectedGoods(val)
      }
    }
  },

  mounted: {},

  methods: {
    checkedProcessGoods (data) {
      console.log('父组件获取', data)
      data.forEach(item => {
        item.uuid = item.gxuuid
        item.name = item.gxname
      })
      this.bindGoods = data
    },
    closeDialog () {
      this.$emit('closeDialog')
      this.openGoodsDialog = false
    },
    getSelectedGoods (val) {
      this.axios.get('/MKL/templateMaterial/queryMaterialByTemplateNoPage', {
        params: {
          templateUuid: val
        }
      })
        .then((res) => {
          console.log(res)
          res.data.forEach(e => {
            e.dw = e.auxiliaryUnitList[0]
          })
          this.goods = res.data
        })
    },
    openGoods () {
      this.openGoodsDialog = true
    },
    closeGoodsDialog () {
      this.openGoodsDialog = false
    }
  }
}

</script>
<style lang='stylus' scoped></style>